import moment from 'moment'
import * as echarts from 'echarts'
import {convert_cost} from "@/utils/util";
import axios from "axios";
import * as d3 from "d3";
// import {nextSequence} from "@/api/redPacker";
// import VXETable from "vxe-table";
// import {message, Modal} from "ant-design-vue";
// message.config({
//     duration: 2,
//     top: '100px', // 到页面顶部距离
//     maxCount: 2
// });
export function pagerConfig() {
    return {
        total: 0,
        currentPage: 1,
        pageSize: 10,
        pageSizes: [10, 20, 40, 100]
    }
}

export function rowConfig() {
    return {
        isHover: true
    }
}

export function heightConfig() {
    return window.innerHeight * 0.12
}

export function heightConfig2() {
    // 计算67vh对应的像素值
    let innerHeight = window.innerHeight
    if (innerHeight > 900) {
        return window.innerHeight * 0.7
    } else if (innerHeight > 500) {
        return window.innerHeight * 0.5
    } else {
        return window.innerHeight * 0.3
    }
}

export function heightConfig3() {
    // 计算67vh对应的像素值
    let innerHeight = window.innerHeight
    if (innerHeight > 900) {
        return window.innerHeight * 0.65
    } else if (innerHeight > 500) {
        return window.innerHeight * 0.45
    } else {
        return window.innerHeight * 0.3
    }
}

export function heightConfig4() {
    return window.innerHeight * 0.32
}

export function heightConfig5() {
    return window.innerHeight * 0.6
}

export function heightConfig6() {
    return window.innerHeight * 0.58
}

export function proxyConfig(this_) {
    return {
        seq: true, // 启用动态序号代理（分页之后索引自动计算为当前页的起始序号）
        props: {
            // 自定义响应结果读取的字段，例如返回结果为：{result: [], page: {total: 10}}
            result: 'result',
            total: 'page.total'
        },
        ajax: {
            // 接收 Promise
            query: ({page, sort}) => {
                return new Promise(resolve => {
                    setTimeout(() => {
                        if (sort.order !== undefined) {
                            this_.allDataSource.sort((a, b) => {
                                const field = sort.field
                                const order = sort.order === 'asc' ? 1 : -1
                                return a[field] < b[field] ? -order : order
                            })
                        }
                        let slice = this_.allDataSource.slice((page.currentPage - 1) * page.pageSize, page.currentPage * page.pageSize)
                        resolve({
                            page: {
                                total: this_.allDataSource.length
                            },
                            // 前台分页查询
                            result: this_.allDataSource.slice((page.currentPage - 1) * page.pageSize, page.currentPage * page.pageSize)
                        })
                        this_.$refs.xGrid.loadData(slice)
                    }, 100)
                })
            }
        }
    }
}

export function proxyConfig2(this_) {
    return {
        seq: true, // 启用动态序号代理（分页之后索引自动计算为当前页的起始序号）
        props: {
            // 自定义响应结果读取的字段，例如返回结果为：{result: [], page: {total: 10}}
            result: 'result',
            total: 'page.total'
        },
        ajax: {
            // 接收 Promise
            query: ({page, sort}) => {
                return new Promise(resolve => {
                    setTimeout(() => {
                        if (sort.order !== undefined) {
                            this_.allDataSource2.sort((a, b) => {
                                const field = sort.field
                                const order = sort.order === 'asc' ? 1 : -1
                                return a[field] < b[field] ? -order : order
                            })
                        }
                        let slice = this_.allDataSource2.slice((page.currentPage - 1) * page.pageSize, page.currentPage * page.pageSize)
                        resolve({
                            page: {
                                total: this_.allDataSource2.length
                            },
                            // 前台分页查询
                            result: this_.allDataSource2.slice((page.currentPage - 1) * page.pageSize, page.currentPage * page.pageSize)
                        })
                        this_.$refs.xGrid2.loadData(slice)
                    }, 100)
                })
            }
        }
    }
}

export function proxyConfig3(this_) {
    return {
        seq: true, // 启用动态序号代理（分页之后索引自动计算为当前页的起始序号）
        props: {
            // 自定义响应结果读取的字段，例如返回结果为：{result: [], page: {total: 10}}
            result: 'result',
            total: 'page.total'
        },
        ajax: {
            // 接收 Promise
            query: ({page, sort}) => {
                return new Promise(resolve => {
                    setTimeout(() => {
                        if (sort.order !== undefined) {
                            this_.allDataSource3.sort((a, b) => {
                                const field = sort.field
                                const order = sort.order === 'asc' ? 1 : -1
                                return a[field] < b[field] ? -order : order
                            })
                        }
                        let slice = this_.allDataSource3.slice((page.currentPage - 1) * page.pageSize, page.currentPage * page.pageSize)
                        resolve({
                            page: {
                                total: this_.allDataSource3.length
                            },
                            // 前台分页查询
                            result: this_.allDataSource3.slice((page.currentPage - 1) * page.pageSize, page.currentPage * page.pageSize)
                        })
                        this_.$refs.xGrid3.loadData(slice)
                    }, 100)
                })
            }
        }
    }
}

export function loadCurrentPageData(currentPage, this_) {
    this_.$refs.xGrid.resetEvent()
    const pageSize = this_.gridOptions === undefined ? 10 : this_.gridOptions.pagerConfig.pageSize
    const startIndex = (currentPage - 1) * pageSize
    const endIndex = currentPage * pageSize
    // 前台分页查询
    let currentPageData = this_.allDataSource.slice(startIndex, endIndex)
    this_.$refs.xGrid.tablePage.total = this_.allDataSource.length
    return this_.$refs.xGrid.loadData(currentPageData) // 使用 loadData 方法加载当前页数据
}

export function loadCurrentPageData2(currentPage, this_) {
    const pageSize = this_.gridOptions2 === undefined ? 10 : this_.gridOptions2.pagerConfig.pageSize
    const startIndex = (currentPage - 1) * pageSize
    const endIndex = currentPage * pageSize
    // 前台分页查询
    let currentPageData = this_.allDataSource2.slice(startIndex, endIndex)
    this_.$refs.xGrid2.tablePage.total = this_.allDataSource2.length
    return this_.$refs.xGrid2.loadData(currentPageData) // 使用 loadData 方法加载当前页数据
}

export function loadCurrentPageData3(currentPage, this_) {
    const pageSize = this_.gridOptions3 === undefined ? 10 : this_.gridOptions3.pagerConfig.pageSize
    const startIndex = (currentPage - 1) * pageSize
    const endIndex = currentPage * pageSize
    // 前台分页查询
    let currentPageData = this_.allDataSource3.slice(startIndex, endIndex)
    this_.$refs.xGrid3.tablePage.total = this_.allDataSource3.length
    return this_.$refs.xGrid3.loadData(currentPageData) // 使用 loadData 方法加载当前页数据
}

export function handleSortChange(e, this_) {
    return this_.gridOptions.proxyConfig.ajax.query({page: this_.$refs.xGrid.tablePage, sort: e})
}

export function handleSortChange2(e, this_) {
    return this_.gridOptions2.proxyConfig.ajax.query({page: this_.$refs.xGrid2.tablePage, sort: e})
}

export function handleSortChange3(e, this_) {
    return this_.gridOptions3.proxyConfig.ajax.query({page: this_.$refs.xGrid3.tablePage, sort: e})
}

export function removeNullChildren(allClassify) {
    for (let i = 0; i < allClassify.length; i++) {
        if (allClassify[i].children === null) {
            let item = JSON.parse(JSON.stringify(allClassify[i]))
            delete item.children
            allClassify[i] = item
        } else {
            removeNullChildren(allClassify[i].children)
        }
    }
    return allClassify
}

export function onIframeLoad(document) {
    let elementById = document.getElementById('iframe')
    console.log('elementById', elementById)
    // 获取 iframe 内部的文档对象
    const iframeDoc = elementById.contentDocument || elementById.contentWindow.document
    // 获取 iframe 内部 body 的高度
    let body = iframeDoc.body
    body.style.height = '96%'
}

export function formattedMonth(data) {
    if (!data) return null
    return moment(data).format('yyyy-MM')
}

export function formattedDate(data) {
    if (!data) return null
    return moment(data).format('yyyy-MM-DD')
}

export function formattedDateTime(data) {
    if (!data) return null
    return moment(data).format('yyyy-MM-DD HH:mm:ss')
}

export function formattedDateTime2(data) {
    if (!data) return null
    return moment(data, 'YYYYMMDDHHmmss').format('yyyy-MM-DD HH:mm:ss')
}

export function formattedMonthByArray(data) {
    if (data && data.length === 0) return []
    let arr = []
    if (data && data.length > 0) {
        for (let d of data) {
            arr.push(formattedMonth(d))
        }
    }
    return arr
}

export function formattedDateTimeByArray(data) {
    if (data && data.length === 0) return []
    let arr = []
    if (data && data.length > 0) {
        for (let d of data) {
            arr.push(formattedDateTime(d))
        }
    }
    return arr
}

export function pickerOptions() {
    return {
        shortcuts: [
            {
                text: '今天',
                onClick(picker) {
                    const end = new Date()
                    const start = new Date()
                    // 设置开始日期为今天零点
                    start.setHours(0, 0, 0, 0)
                    // 设置结束日期为当前时间
                    end.setHours(23, 59, 59, 999)
                    picker.$emit('pick', [start, end])
                }
            },
            {
                text: '最近一周',
                onClick(picker) {
                    const end = new Date()
                    const start = new Date()
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
                    picker.$emit('pick', [start, end])
                }
            }, {
                text: '最近一个月',
                onClick(picker) {
                    const end = new Date()
                    const start = new Date()
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
                    picker.$emit('pick', [start, end])
                }
            }, {
                text: '最近三个月',
                onClick(picker) {
                    const end = new Date()
                    const start = new Date()
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
                    picker.$emit('pick', [start, end])
                }
            }
        ]
    }
}

/**
 * 只能选择近day天的日期
 * @returns {{shortcuts: [{onClick(*): void, text: string},{onClick(*): void, text: string},{onClick(*): void, text: string}]}}
 */
export function pickerOptions2(day) {
    return {
        shortcuts: [
            {
                text: '今天',
                onClick(picker) {
                    const end = new Date()
                    const start = new Date()
                    // 设置开始日期为今天零点
                    start.setHours(0, 0, 0, 0)
                    // 设置结束日期为当前时间
                    end.setHours(23, 59, 59, 999)
                    picker.$emit('pick', [start, end])
                }
            },
            {
                text: '最近一周',
                onClick(picker) {
                    const end = new Date()
                    const start = new Date()
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
                    start.setHours(0, 0, 0, 0)
                    end.setHours(23, 59, 59, 999)
                    picker.$emit('pick', [start, end])
                }
            },
            {
                text: '最近一个月',
                onClick(picker) {
                    const end = new Date()
                    const start = new Date()
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
                    start.setHours(0, 0, 0, 0)
                    end.setHours(23, 59, 59, 999)
                    picker.$emit('pick', [start, end])
                }
            }
        ],
        disabledDate(time) {
            const today = new Date()
            // 设置今天零点
            today.setHours(23, 59, 59, 999)
            // 计算最早可选日期，即30天前
            const earliestDate = new Date(today.getTime() - 3600 * 1000 * 24 * day)
            // 禁用最早可选日期之前的日期和今天之后的日期
            return time.getTime() < earliestDate.getTime() || time.getTime() > today.getTime()
        }
    }
}

export function isNumber(data) {
    return /^\d+$/.test(data)
}

// 是否超过20M 超过true 不超过 false
export function checkFileSize(file) {
    const maxSize = 20 * 1024 * 1024 // 20MB
    return file.size > maxSize
}

// 验证文件类型是否为（csv或者txt） 是true 否 false
export function checkFileType(file) {
    const fileType = file.type
    return (fileType === 'text/plain' || fileType === 'text/csv')
}

// 禁止自动上传
export function customRequest() {
    return false
}

export function checkFileSize2(file) {
    const maxSize = 20 * 1024 * 1024 // 20MB
    if (file.size > maxSize) {
        message.warning('文件大小超过限制（最大20MB）')
        return true
    }
    return false
}

export function checkFileSizeIsNull(file) {
    if (file.size === 0) {
        message.warning('无效文件，文件为空!')
        return true
    }
    return false
}

// 验证文件类型是否为（PDF、Word或Excel） -1不符合格式  0pdf  1word  2excel
export function checkFileType2(file) {
    const fileName = file.name
    const suffix = fileName.substring(fileName.lastIndexOf('.') + 1).toLowerCase()
    if (suffix === 'pdf') {
        return 0
    } else if (suffix === 'doc' || suffix === 'docx') {
        return 1
    } else if (suffix === 'xls' || suffix === 'xlsx' || suffix === 'csv') {
        return 2
    } else {
        const fileType = file.type
        if (fileType === 'application/pdf') {
            return 0
        } else if (fileType === 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' || fileType === 'application/msword') {
            return 1
        } else if (fileType === 'application/vnd.ms-excel' || fileType === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' || fileType === 'text/csv') {
            return 2
        } else {
            message.warning('请上传 PDF 或 Word 或 Excel文件')
            return -1
        }
    }
}

// 获取下一个序列
export async function getNextSequence(this_) {
    await nextSequence().then((res) => {
        this_.form.maxid = res.data.data
        console.log('获取下一个序列：', res)
    }).catch((res) => {
        console.log(res)
        this_.$message.error('获取下一个序列异常')
    })
}

export function getBase64(file) {
    return new Promise((resolve, reject) => {
        const reader = new FileReader()
        reader.readAsDataURL(file)
        reader.onload = () => resolve(reader.result)
        reader.onerror = error => reject(error)
    })
}

const colors = [
    '#f5abab', '#ffcc99', '#ffff99', '#ccff99', '#99ff99',
    '#99ffcc', '#99ffff', '#99ccff', '#9999ff', '#cc99ff',
    '#ff99ff', '#ff99cc', '#ea7777', '#c4a484', '#ffff66',
    '#b3ff66', '#66ff66', '#66ffb3', '#66ffff', '#66b3ff',
    '#6666ff', '#b366ff', '#ff66ff', '#ff66b3', '#ff3333',
    '#ff9933', '#ffff33', '#99ff33', '#33ff33', '#33ff99'
]

/**
 * 基础柱状图
 * @param _this this
 * @xName x轴名称
 * @yName y轴名称
 * @dataList 数据集合
 * @x_key x轴key
 * @y_key y轴key
 * @suffix 图例后缀
 * @tab_title 表格标题
 * @param form 数据集对象
 * */
export function set_option_base(_this, form) {
    let data = form.dataList.map(item => item[form.x_key])
    let data2 = form.dataList.map(item => convert_cost(item[form.y_key]))
    return {
        trigger: 'axis',
        axisPointer: {
            type: 'cross',
            lineStyle: {
                type: 'dashed'
            }
        },
        legend: {},
        grid: {
            left: '2%',
            bottom: '3%',
            width: '93%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            name: form.x_name,
            nameTextStyle: {
                fontWeight: 'bold',
                fontSize: 17
            },
            data: data,
            axisTick: {
                alignWithLabel: true
            },
            show: true // 显示 X 轴
        },
        yAxis: [
            {
                type: 'value',
                name: form.y_name,
                nameTextStyle: {
                    fontWeight: 'bold',
                    fontSize: 17
                },
                position: 'left',
                axisLabel: {
                    formatter: '{value} ' + form.y_suffix
                },
                show: true // 显示 Y 轴
            }
        ],
        series: [
            {
                name: form.title,
                type: 'bar',
                yAxisIndex: 0,
                barWidth: '60%',
                color: '#ffa463',
                data: data2,
                itemStyle: {
                    // 设置柱状图颜色
                    color: function (params) {
                        return colors[params.dataIndex % colors.length]
                    }
                },
                label: {
                    show: true, // 显示标签
                    position: 'top', // 标签位置：上方
                    formatter: '{c}' + form.y_suffix // 标签格式化为百分比
                }
            }
        ],
        tooltip: {
            // 设置鼠标滑过时的提示框
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                lineStyle: {
                    type: 'dashed' // 设置虚线样式
                }
            },
            formatter: function (params) {
                const dataIndex = params[0].dataIndex
                const value = params[0].value
                return `${form.x_name}：${data[dataIndex]}<br/>${form.y_name}：${value}元`
            }
        }
    }
}


/**
 * 基础柱状图 + 渐变色
 * @param _this this
 * @xName x轴名称
 * @yName y轴名称
 * @dataList 数据集合
 * @x_key x轴key
 * @y_key y轴key
 * @suffix 图例后缀
 * @tab_title 表格标题
 * @param form 数据集对象
 * */
export function set_option_base_gradient_ramp(_this, form) {
    let data = form.dataList.map(item => item[form.x_key]);
    let data2 = form.dataList.map(item => item[form.y_key]);

    return {
        trigger: 'axis',
        axisPointer: {
            type: 'cross',
            lineStyle: {
                type: 'dashed'
            }
        },
        legend: {
            show: false // 完全隐藏图例
        },
        grid: {
            top: '45',
            left: '2%',
            bottom: '5%',
            width: '93%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            nameTextStyle: {
                fontWeight: 'bold',
                color: form.x_color // X 轴名称文字颜色
            },
            axisLabel: {
                textStyle: {
                    color: form.x_color // X 轴标签文字颜色
                }
            },
            axisLine: {
                show: true, // 显示 X 轴线
                lineStyle: {
                    color: form.x_line_color // X 轴线颜色
                }
            },
            splitLine: {
                show: false // 隐藏 X 轴网格线
            },
            data: data,
            axisTick: {
                alignWithLabel: true
            },
            show: true
        },
        yAxis: [
            {
                type: 'value',
                name: form.y_name,
                nameLocation: 'end', // 名称位置
                nameGap: 15, // 名称与轴线的距离
                nameTextStyle: {
                    fontWeight: 'bold',
                    color: form.y_color // Y 轴名称文字颜色
                },
                position: 'left',
                axisLabel: {
                    textStyle: {
                        color: form.y_color // Y 轴标签文字颜色
                    },
                    formatter: '{value} ' + form.y_suffix
                },
                axisLine: {
                    show: true, // 显示 Y 轴线
                    lineStyle: {
                        color: form.y_line_color // Y 轴线颜色
                    }
                },
                splitLine: {
                    show: false // 隐藏 Y 轴网格线
                },
                show: true // 显示 Y 轴
            }
        ],
        series: [
            {
                name: form.title,
                type: 'bar',
                yAxisIndex: 0,
                barWidth: '26%', // 设置柱状图的宽度窄一点
                data: data2,
                itemStyle: {
                    // 设置柱状图颜色为渐变色
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        { offset: 0, color: '#088F8B' }, // 顶部颜色
                        { offset: 1, color: '#022B4C' } // 底部颜色
                    ])
                },
                label: {
                    show: true, // 显示标签
                    position: 'top', // 标签位置：上方
                    formatter: '{c}', // 标签格式化
                    // formatter: '{c}' + form.y_suffix, // 标签格式化
                    textStyle: {
                        color: form.color // 标签文字颜色
                    }
                }
            }
        ],
        tooltip: {
            // 设置鼠标滑过时的提示框
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                lineStyle: {
                    type: 'dashed' // 设置虚线样式
                }
            },
            formatter: function (params) {
                const dataIndex = params[0].dataIndex;
                const value = params[0].value;
                return `${form.x_name}：${data[dataIndex]}<br/>${form.y_name}：${value}元`;
            }
        }
    }
}


/**
 * 加了平均值 和 柱状图圆角
 * @param _this
 * @xName x轴名称
 * @yName y轴名称
 * @dataList 数据集
 * @x_key x轴key
 * @y_key y轴key
 * @suffix 后缀
 * @tab_title 标题
 * @param form 数据对象
 */
export function set_option_pro(_this, form) {
    let data = form.dataList.map(item => item[form.x_key]);
    let data2 = form.dataList.map(item => convert_cost(item[form.y_key]));
    let average = data2.reduce((sum, value) => sum + value, 0) / data2.length; // 计算平均值
    console.log(form)
    return {
        trigger: 'axis',
        axisPointer: {
            type: 'cross',
            lineStyle: {
                type: 'dashed'
            }
        },
        legend: {},
        grid: {
            left: '2%',
            bottom: '3%',
            width: '93%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            name: form.x_name,
            nameTextStyle: {
                fontWeight: 'bold',
                fontSize: 17
            },
            data: data,
            axisTick: {
                alignWithLabel: true
            },
            show: true // 显示 X 轴
        },
        yAxis: [
            {
                type: 'value',
                name: form.y_name,
                nameTextStyle: {
                    fontWeight: 'bold',
                    fontSize: 17
                },
                position: 'left',
                axisLabel: {
                    formatter: '{value} ' + form.y_suffix
                },
                show: true // 显示 Y 轴
            }
        ],
        series: [
            {
                name: form.title,
                type: 'bar',
                yAxisIndex: 0,
                barWidth: '60%',
                color: '#ffa463',
                data: data2,
                itemStyle: {
                    color: function (params) {
                        return colors[params.dataIndex % colors.length];
                    },
                    barBorderRadius: [10, 10, 0, 0] // 设置柱状图为圆角
                },
                label: {
                    show: true, // 显示标签
                    position: 'top', // 标签位置：上方
                    formatter: '{c}' + form.y_suffix // 标签格式化为百分比
                },
                markLine: { // 添加虚线箭头表示平均值
                    data: [
                        {
                            type: 'average',
                            name: 'Avg'
                        }
                    ],
                    lineStyle: {
                        type: 'dashed',
                        color: '#f27126',
                        width: 2 // 设置虚线的宽度为2px
                    },
                    label: {
                        show: true,
                        position: 'end',
                        formatter: '日均: {c}' + form.y_suffix
                    }
                }
            }
        ],
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                lineStyle: {
                    type: 'dashed' // 设置虚线样式
                }
            },
            formatter: function (params) {
                const dataIndex = params[0].dataIndex;
                const value = params[0].value;
                return `${form.x_name}：${data[dataIndex]}<br/>${form.y_name}：${value}元`;
            }
        }
    };
}

/**
 * 加了平均值、柱状图圆角、颜色渐变、缩放
 * @param _this
 * @xName x轴名称
 * @yName y轴名称
 * @dataList 数据集
 * @x_key x轴key
 * @y_key y轴key
 * @suffix 后缀
 * @tab_title 标题
 * @color 标题颜色
 * @param form 数据集对象
 */
export function set_option_pro_plus(_this, form) {
    let data = form.dataList.map(item => item[form.x_key])
    let data2 = form.dataList.map(item => convert_cost(item[form.y_key]))

    return {
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                lineStyle: {
                    type: 'dashed'
                }
            },
            formatter: function (params) {
                const dataIndex = params[0].dataIndex
                const value = params[0].value
                return `${form.x_name}：${data[dataIndex]}<br/>${form.y_name}：${value}元`
            }
        },
        legend: {
            textStyle: {
                fontSize: 17,
                fontWeight: 'bold',
                color: form.color // 设置 tab_title 的颜色
            }
        },
        grid: {
            left: '2%',
            bottom: '3%',
            width: '93%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            name: form.x_name,
            nameTextStyle: {
                fontWeight: 'bold',
                color: form.color,
                fontSize: 17
            },
            data: data,
            axisTick: {
                alignWithLabel: true
            },
            axisLine: {
                show: true,
                lineStyle: {
                    color: '#686767', // 设置 X 轴线的颜色
                    type: 'dashed' // 设置 X 轴线为虚线
                }
            },
            show: true // 显示 X 轴
        },
        yAxis: [
            {
                type: 'value',
                name: form.y_name,
                nameTextStyle: {
                    fontWeight: 'bold',
                    color: form.color,
                    fontSize: 17
                },
                position: 'left',
                axisLabel: {
                    formatter: '{value} ' + form.y_suffix
                },
                show: true
            }
        ],
        dataZoom: [
            {
                type: 'inside',
                start: 0,
                end: 100
            },
            {
                type: 'slider',
                start: 0,
                end: 100
            }
        ],
        series: [
            {
                name: form.title,
                type: 'bar',
                yAxisIndex: 0,
                barWidth: '60%',
                color: '#ffa463',
                data: data2,
                itemStyle: {
                    color: function (params) {
                        // 动态生成渐变色
                        let color = colors[params.dataIndex % colors.length]
                        return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                            {offset: 0, color: adjustColorBrightness(color, 80)},
                            {offset: 1, color: color}
                        ])
                    },
                    borderRadius: [10, 10, 0, 0] // 设置柱状图为圆角
                },
                label: {
                    show: true, // 显示标签
                    color: form.color,
                    position: 'top', // 标签位置：上方
                    formatter: '{c}' + form.y_suffix // 标签格式化为百分比
                },
                markLine: { // 添加虚线箭头表示平均值
                    data: [
                        {
                            type: 'average',
                            name: 'Avg'
                        }
                    ],
                    lineStyle: {
                        type: 'dashed',
                        color: '#f27126',
                        width: 2 // 设置虚线的宽度为2px
                    },
                    label: {
                        show: true,
                        color: form.color,
                        position: 'end',
                        formatter: '日均: {c}' + form.y_suffix
                    }
                }
            }
        ]
    }
}


/**
 * 调整颜色亮度（柱状图柱子）
 * @param color
 * @param amount
 * @returns {string}
 */
function adjustColorBrightness(color, amount) {
    // 调整颜色亮度
    let usePound = false
    if (color[0] === '#') {
        color = color.slice(1)
        usePound = true
    }

    let num = parseInt(color, 16)

    let r = (num >> 16) + amount
    let g = ((num >> 8) & 0x00FF) + amount
    let b = (num & 0x0000FF) + amount

    r = Math.max(Math.min(255, r), 50)
    g = Math.max(Math.min(255, g), 50)
    b = Math.max(Math.min(255, b), 50)

    return (usePound ? '#' : '') + (g | (b << 8) | (r << 16)).toString(16).padStart(6, '0')
}

/**
 * 封装一个表盘
 * @param _this
 * @param name 表盘标签
 * @param maxNum 最大值
 * @param currentNum 当前值
 */
export function set_option_gauge(_this, name, maxNum, currentNum) {
    return {
        series: [
            {
                type: 'gauge', // 仪表盘类型
                axisLine: {
                    lineStyle: {
                        splitNumber: 10,
                        width: 26, // 轴线宽度
                        color: [ // 颜色渐变
                            [0.3, '#48ffa6'], // 0-20%范围内的颜色
                            [0.6, '#44c5fe'], // 20-40%范围内的颜色
                            [0.9, '#fe9137'], // 40-70%范围内的颜色
                            [1, '#fe3333']   // 70-100%范围内的颜色
                        ]
                    }
                },
                pointer: {
                    itemStyle: {
                        color: 'auto' // 指针颜色自适应
                    }
                },
                axisTick: {
                    distance: -30, // 刻度线与轴线距离
                    length: 8,      // 刻度线长度
                    lineStyle: {
                        color: '#fff', // 刻度线颜色
                        width: 2       // 刻度线宽度
                    }
                },
                splitLine: {
                    distance: -30, // 分隔线与轴线距离
                    length: 30,     // 分隔线长度
                    lineStyle: {
                        color: '#fff', // 分隔线颜色
                        width: 4       // 分隔线宽度
                    }
                },
                axisLabel: {
                    color: 'inherit', // 刻度标签颜色
                    distance: 31,     // 刻度标签与轴线距离
                    fontSize: 12,      // 刻度标签字体大小
                    formatter: function (value) { // 保留整数
                        // 检查value是否为空或0，如果是，则返回空字符串，否则格式化为整数
                        return value ? value.toFixed(0) : ''
                    }
                },
                detail: {
                    valueAnimation: true, // 数值变化动画
                    formatter: '{value}元', // 格式化数值显示，加上单位“元”
                    color: 'inherit',       // 数值颜色
                    fontSize: 18       // 数值字体大小
                },
                max: maxNum,  // 仪表盘最大值
                data: [
                    {
                        value: currentNum, // 当前数值
                        name: name,
                        title: {
                            color: 'inherit',
                            fontSize: 14 // 设置 name 字体大小
                        }
                    }
                ]
            }
        ]
    }
}


/**
 * 饼图配置
 * @param _this
 * @param form
 * @param form.title 标题
 * @param form.encode_value  映射到 ECharts 的 'value' 字段
 * @param form.encode_name 映射到 ECharts 的 'name' 字段
 * @param form.sort_field 需要排序的字段，不需要排序传null
 * @param form.x_name x轴名称
 * @param form.y_name y轴名称
 * @param form.y_suffix y轴后缀名称
 * @param form.dataList 数据集合
 */
export function set_option_Pie(_this, form) {
    if (form.sort_field != null) {
        // 对dataList排序
        form.dataList.sort(function (a, b) {
            return b[form.sort_field] - a[form.sort_field]
        });
    }

    return {
        legend: {
            type: 'scroll',
            orient: 'vertical',
            right: 0,
            top: 50,
            bottom: 20,
        },
        title: {
            text: form.title,
            left: form.title_center
        },
        // 数据视图 下载按钮等
        toolbox: {
            show: true,
            feature: {
                mark: {show: true},
                dataView: {show: false, readOnly: false},
                restore: {show: false},
                saveAsImage: {show: true}
            }
        },
        // 自定义 鼠标hover tooltip 格式
        tooltip: {
            trigger: 'item',
            formatter: function (params) {
                return `${colorDot(colors[0])}${form.x_name}: ${params.name}<br/>
                        ${colorDot(colors[1])}${form.y_name}: ${params.value}${form.y_suffix}`;
            }
        },
        series: [
            {
                name: form.title,
                type: 'pie',
                radius: [50, 250],
                center: ['50%', '50%'],
                roseType: 'area',
                itemStyle: {
                    borderRadius: 8
                },
                label: {
                    formatter: '{b}: {c}' + form.y_suffix // 添加标签格式，这里 {b} 是名称，{c} 是值
                },
                data: form.dataList.map(item => ({
                    value: item[form.encode_value],
                    name: item[form.encode_name]
                }))
            }
        ]
    };
}

/**
 *  颜色点
 * @param color
 * @returns {string}
 */
export function colorDot(color) {
    return `<span style='display:inline-block;margin-right:6px;border-radius:10px;width:10px;height:10px;background-color:${color};'></span>`;
}

/**
 * 折线图配置(一)
 * @param _this
 * @param form
 */
export function set_option_BrokenLine(_this, form) {
    let dataList = form.dataList;
    if (!dataList || dataList.length === 0) return
    if (form.sort_field != null) {
        // 对dataList排序
        form.dataList.sort(function (a, b) {
            return a[form.sort_field] - b[form.sort_field]
        });
    }
    let data = dataList.map(item => item[form.x_key])
    let mans = dataList.map(item => item['man'])
    let girls = dataList.map(item => item['girl'])
    let data2 = dataList.map(item => item[form.y_key])

    // 生成 tooltip formatter
    const formatter = createTooltipFormatter(mans, girls, form);
    return {
        title: {
            text: form.title,  // 图表的标题
            left: 'center'     // 标题居中
        },
        tooltip: {
            trigger: 'axis',
            formatter: formatter,
            axisPointer: {
                type: 'cross',  // 显示交叉的虚线指示器
                label: {
                    backgroundColor: '#66b3ff'  // 虚线指示器标签背景色
                }
            }
        },
        xAxis: {
            type: 'category',
            data: data,
            name: form.x_name, // X 轴的名称
            nameLocation: 'end', // 名称位置
            nameGap: 15 // 名称与轴线的距离
        },
        yAxis: {
            type: 'value',
            name: form.y_name, // Y 轴的名称
            nameLocation: 'end', // 名称位置
            nameGap: 20 // 名称与轴线的距离
        },
        series: [
            {
                data: data2,
                type: 'line',
                smooth: true
            }
        ]
    }
}


/**
 * 生成 tooltip
 * @param form
 * @returns {function(*): *}
 */
function createTooltipFormatter(mans, girls, form) {
    let cache = {}; // 缓存计算结果
    return function (params) {
        let param = params[0];
        let dataIndex = param.dataIndex;
        if (!cache[dataIndex]) {
            let total = mans[dataIndex] + girls[dataIndex];
            let manPercentage = (mans[dataIndex] / total * 100).toFixed(2);
            let girlPercentage = (girls[dataIndex] / total * 100).toFixed(2);

            // 使用颜色数组
            cache[dataIndex] = `${colorDot(colors[0])}${form.x_name}: ${param.name}<br>
                                ${colorDot(colors[1])}${form.y_name}: ${param.value}<br>
                                ${colorDot(colors[2])}男性: ${mans[dataIndex]}人 (${manPercentage}%)<br>
                                ${colorDot(colors[3])}女性: ${girls[dataIndex]}人 (${girlPercentage}%)`;
        }
        return cache[dataIndex];
    }
}


/**
 * 折线图配置（二）
 * @param _this
 * @param form
 */
export function set_option_BrokenLine2(_this, form) {
    let dataList = form.dataList;
    if (!dataList || dataList.length === 0) return
    if (form.sort_field != null) {
        // 对dataList排序
        form.dataList.sort(function (a, b) {
            return a[form.sort_field] - b[form.sort_field]
        });
    }
    let data = dataList.map(item => item[form.x_key])
    let data2 = dataList.map(item => item[form.y_key])

    // 生成 tooltip formatter
    const formatter = createTooltipFormatter2(form);
    return {
        title: {
            text: form.title,  // 图表的标题
            left: 'center'     // 标题居中
        },
        tooltip: {
            trigger: 'axis',
            formatter: formatter,
            axisPointer: {
                type: 'cross',  // 显示交叉的虚线指示器
                label: {
                    backgroundColor: '#66b3ff'  // 虚线指示器标签背景色
                }
            }
        },
        xAxis: {
            type: 'category',
            data: data,
            name: form.x_name, // X 轴的名称
            nameLocation: 'end', // 名称位置
            nameGap: 15 // 名称与轴线的距离
        },
        yAxis: {
            type: 'value',
            name: form.y_name, // Y 轴的名称
            nameLocation: 'end', // 名称位置
            nameGap: 20 // 名称与轴线的距离
        },
        series: [
            {
                data: data2,
                type: 'line',
                smooth: true
            }
        ]
    }
}


/**
 * 生成 tooltip 2
 * @param form
 * @returns {function(*): *}
 */
function createTooltipFormatter2(form) {
    let cache = {}; // 缓存计算结果
    return function (params) {
        let param = params[0];
        let dataIndex = param.dataIndex;
        if (!cache[dataIndex]) {
            // 使用颜色数组
            cache[dataIndex] = `${colorDot(colors[0])}${form.x_name}: ${param.name}<br>
                                ${colorDot(colors[1])}${form.y_name}: ${param.value}`;
        }
        return cache[dataIndex];
    }
}



/**
 * 折线图配置（三 去除标题 添加折线覆盖面积并且渐变色）
 * @param _this
 * @param form
 */
export function set_option_BrokenLine3(_this, form) {
    let dataList = form.dataList;
    if (!dataList || dataList.length === 0) return
    if (form.sort_field != null) {
        // 对dataList排序
        form.dataList.sort(function (a, b) {
            return a[form.sort_field] - b[form.sort_field]
        });
    }
    let data = dataList.map(item => item[form.x_key])
    let data2 = dataList.map(item => item[form.y_key])
    // 生成 tooltip formatter
    const formatter = createTooltipFormatter2(form);

    return {
        grid: {
            top: '5%',    // 调整顶部边距
            bottom: '7%', // 调整底部边距
            left: '3%',   // 调整左侧边距
            right: '6%',  // 调整右侧边距
            containLabel: true
        },
        tooltip: {
            trigger: 'axis',
            formatter: formatter,
            axisPointer: {
                type: 'cross',  // 显示交叉的虚线指示器
                label: {
                    backgroundColor: '#66b3ff'  // 虚线指示器标签背景色
                }
            }
        },
        xAxis: {
            type: 'category',
            data: data,
            boundaryGap: false, // 设置不留边界间隙
            axisLabel: {
                textStyle: {
                    color: form.x_color // X 轴标签文字颜色为白色
                }
            },
            nameTextStyle: {
                color: form.x_color // X 轴名称文字颜色为白色
            },
            axisLine: {
                show: true, // 显示 X 轴线
                lineStyle: {
                    color: form.x_line_color // X 轴线颜色
                }
            },
        },
        yAxis: {
            type: 'value',
            min: 'dataMin',  // 自动根据数据最小值设置Y轴最小值
            max: 'dataMax',  // 自动根据数据最大值设置Y轴最大值
            axisLabel: {
                textStyle: {
                    color: form.y_color // Y轴标签文字颜色
                }
            },
            nameTextStyle: {
                color: form.y_color // Y轴名称文字颜色
            },
            axisLine: {
                show: true,
                lineStyle: {
                    color: form.y_line_color // Y轴线颜色
                }
            },
            splitLine: {
                show: true,
                lineStyle: {
                    color: form.y_line_color,
                    opacity: 0.3 // 网格线的不透明度为0.3
                },
            },
            show: true
        },
        series: [
            {
                data: data2,
                type: 'line',
                smooth: true,
                showSymbol: true,  // 确保显示标记
                symbol: 'circle',  // 设置标记为圆形
                symbolSize: 4,     // 设置标记的大小为5（这可以根据需求调整）
                itemStyle: {
                    normal: {
                        color: '#32A6FF', // 设置数据点的颜色
                        borderColor: '#32A6FF', // 设置数据点边界的颜色，如果需要
                        borderWidth: 2 // 设置边界的宽度，可调整
                    }
                },
                areaStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        {offset: 0, color: '#00B2F4'}, // 0% 处的颜色
                        {offset: 0.47, color: 'rgba(0,178,244,0.59)'}, // 47% 处的颜色
                        {offset: 1, color: 'rgba(0,255,210,0)'} // 100% 处的颜色
                    ]),
                    opacity: 0.7 // 设置填充的不透明度
                },
                lineStyle: {
                    normal: {
                        width: 2, // 可以调整线宽
                        color: '#32A6FF' // 线条颜色
                    }
                }
            }
        ]
    }
}










/**
 * 散点图的配置
 * @param _this
 * @title 标题
 * @dataList 所有数据
 * @param form
 */
export function set_option_scatterDiagram(_this, form) {
    let data = [];
    const total = form.dataList.length;
    // 获取数据中的最小值和最大值
    const values = form.dataList.map(item => item.value);
    const minValue = Math.min(...values);
    const maxValue = Math.max(...values);

    for (let i = 0; i < total; i++) {
        let item = form.dataList[i];
        const styles = generateStyles(i, total, item.value, minValue, maxValue);
        data.push({
            name: item.name, // 名称
            value: styles.offset, // 设置偏移量（位置）
            symbolSize: styles.symbolSize, // 设置符号大小
            itemValue: item.value, // 添加值到数据项中，方便在 tooltip 中使用
            label: {
                normal: {
                    textStyle: {
                        fontSize: 11 // 标签字体大小
                    }
                }
            },
            itemStyle: {
                normal: {
                    color: styles.color, // 设置颜色
                    opacity: styles.opacity // 设置透明度
                }
            },
        });
    }

    return {
        title: {
            text: form.title, // 图表标题
            left: form.title_center // 标题位置
        },
        grid: {
            show: false,
            top: 10,
            bottom: 10
        },
        tooltip: {
            trigger: 'item', // 触发类型为数据项
            formatter: function (params) {
                // 格式化显示内容，显示名称：数值
                return `${params.data.name}: ${params.data.itemValue}`;
            }
        },
        xAxis: [{
            gridIndex: 0,
            type: 'value',
            show: false,
            min: 0,
            max: 100,
            nameLocation: 'middle',
            nameGap: 5
        }],
        yAxis: [{
            gridIndex: 0,
            min: 0,
            show: false,
            max: 100,
            nameLocation: 'middle',
            nameGap: 30
        }],
        series: [{
            type: 'scatter', // 散点图类型
            symbol: 'circle', // 圆形符号
            symbolSize: 120,
            label: {
                normal: {
                    show: true,
                    formatter: '{b}', // 显示数据项名称
                    color: '#fff',
                    textStyle: {
                        fontSize: '20' // 标签字体大小
                    }
                },
            },
            itemStyle: {
                normal: {
                    color: '#00acea'
                }
            },
            data: data // 设置数据
        }]
    }
}


/**
 * 散点的大小、颜色、位置、偏移量 （分布一）
 * @param index 当前散点的索引
 * @param total 散点的总数
 * @param value 散点的值
 * @param minValue 散点的最小值
 * @param maxValue 散点的最大值
 * @returns {{offset: number[], color: string, symbolSize: number, opacity: number}}
 */

function generateStyles_base(index, total, value, minValue, maxValue) {
    // 计算网格的行和列数
    const gridSize = Math.ceil(Math.sqrt(total));
    const row = Math.floor(index / gridSize);
    const col = index % gridSize;

    // 网格基础偏移量
    const gridSpacing = 100 / gridSize;

    // 计算中心位置
    const centerX = (gridSize - 1) / 2;
    const centerY = (gridSize - 1) / 2;
    const deltaX = col - centerX;
    const deltaY = row - centerY;

    // 计算从中心到当前位置的距离
    const distanceFromCenter = Math.sqrt(deltaX * deltaX + deltaY * deltaY);
    const maxDistance = Math.sqrt(centerX * centerX + centerY * centerY);

    // 基于距离生成扩散因子（0 到 1 之间）
    const spreadFactor = distanceFromCenter / maxDistance;

    // 随机生成的偏移量
    const randomOffset = (Math.random() - 0.5) * 0.2 * gridSpacing;

    // 动态生成偏移量，确保不超出边界
    const offset = [
        Math.min(Math.max((centerX + deltaX * spreadFactor + 0.5) * gridSpacing + randomOffset, 0), 100),
        Math.min(Math.max((centerY + deltaY * spreadFactor + 0.5) * gridSpacing + randomOffset, 0), 100)
    ];

    // 使用线性比例尺动态生成符号大小
    const minSize = 20;
    const maxSize = 80; // 调整最大符号大小
    const symbolSize = Math.min(minSize + ((value - minValue) / (maxValue - minValue)) * (maxSize - minSize), maxSize);

    // 动态生成透明度
    const opacity = 0.6 + (index / total) * 0.4; // 确保透明度在 0.6 到 1 之间

    // 动态生成颜色（使用 HSL 色调）
    const color = `hsl(${Math.random() * 360}, 70%, 50%)`; // 随机颜色

    return {offset, symbolSize, opacity, color};
}


/**
 * 散点的大小、颜色、位置、偏移量（分布二）
 * @param index 当前散点的索引
 * @param total 散点的总数
 * @param value 散点的值
 * @param minValue 散点的最小值
 * @param maxValue 散点的最大值
 * @returns {{offset: number[], color: string, symbolSize: number, opacity: number}}
 */
function generateStyles(index, total, value, minValue, maxValue) {
    // 网格的行和列数
    const gridSize = Math.ceil(Math.sqrt(total));

    // 网格中心点坐标
    const centerX = 50;
    const centerY = 50;

    // 计算角度和半径
    const angle = (index / total) * 2 * Math.PI; // 从 0 到 2π 的角度
    const maxRadius = Math.min(centerX, centerY);
    const radius = Math.sqrt((index / total) * maxRadius ** 2); // 半径从 0 到 maxRadius

    // 添加随机偏移量来打破网格布局的规律性
    const randomOffset = (Math.random() - 0.5) * 10; // 控制随机偏移量的范围

    // 计算散点的偏移量
    const offsetX = centerX + radius * Math.cos(angle) + randomOffset;
    const offsetY = centerY + radius * Math.sin(angle) + randomOffset;

    // 确保偏移量在 0 到 100 的范围内
    const offset = [
        Math.min(Math.max(offsetX, 0), 100),
        Math.min(Math.max(offsetY, 0), 100)
    ];

    // 使用线性比例尺动态生成符号大小
    const minSize = 20;
    const maxSize = 80; // 调整最大符号大小
    const symbolSize = Math.min(minSize + ((value - minValue) / (maxValue - minValue)) * (maxSize - minSize), maxSize);

    // 动态生成透明度
    const opacity = 0.6 + (index / total) * 0.4; // 确保透明度在 0.6 到 1 之间

    // 动态生成颜色（使用 HSL 色调）
    const color = `hsl(${Math.random() * 360}, 70%, 50%)`; // 随机颜色

    return {offset, symbolSize, opacity, color};
}


/**
 * 散点图 + d3配置
 */
let scatterDiagram_color_list = ['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']

// 导出函数，用于生成层次化数据
export function my_stratify_1(_this, form) {
    return d3.stratify()
            // 设置父节点 ID 的提取函数，根据每个节点的 ID 截取最后一个 '.' 前的部分作为父节点 ID
            .parentId(function (d) {
                return d.id.substring(0, d.id.lastIndexOf('.'));
            })(form.dataList) // 将传入的数据列表应用到层次化生成器中
            // 设置每个节点的值的计算方式，如果节点的值为 null 或 undefined，则设为 0
            .sum(function (d) {
                return d.value || 0;
            })
            // 对生成的层次化数据进行排序，按节点的值从大到小排序
            .sort(function (a, b) {
                return b.value - a.value;
            });
}


export function my_renderItem(_this, form) {
    // 获取节点路径和节点值
    let nodePath = form.api.value(form.id);
    let nodeValue = form.api.value(form.value);

    // 获取节点名称，通过路径处理得到
    let nodeName = nodePath
            .slice(nodePath.lastIndexOf('.') + 1)
            .split(/(?=[A-Z][^A-Z])/g)
            .join('\n')

    // 获取节点对象
    let node = form.context.nodes[nodePath];

    // 如果节点ID是'option'，将节点半径设置为0
    if (node.id === form.option) {
        node.r = 0
    }

    // 如果节点不存在，返回不渲染任何内容
    if (!node) {
        // 不渲染任何内容
        return;
    }

    // 根据深度计算z2值，用于确定渲染层次
    let z2 = form.api.value('depth') * 2;

    // 返回渲染配置对象
    return {
        type: 'circle',  // 渲染类型为圆形
        shape: {
            cx: node.x,  // 圆心x坐标
            cy: node.y,  // 圆心y坐标
            r: node.r    // 圆半径
        },
        // transition: ['shape'], // 注释掉的过渡效果
        z2: z2,  // 渲染层次
        textContent: {
            type: 'text',  // 文本类型
            style: {
                // transition: isLeaf ? 'fontSize' : null, // 注释掉的过渡效果
                text: nodeValue + '\n\n' + nodeName,  // 文本内容，包含节点值和节点名称
                fill: '#fff',  // 文本颜色
                fontFamily: 'Arial',  // 字体
                width: node.r * 1.5,  // 文本宽度
                overflow: 'truncate',  // 溢出处理方式
                fontSize: node.r / 3  // 字体大小
            },
            emphasis: {
                style: {
                    overflow: null,  // 溢出处理方式
                    fontSize: Math.max(node.r / 2.2, 14)  // 强调状态下的字体大小
                }
            }
        },
        textConfig: {
            position: 'inside'  // 文本位置
        },
        style: {
            fill: scatterDiagram_color_list[form.idx % scatterDiagram_color_list.length]  // 填充颜色，从颜色列表中选择
        },
        emphasis: {
            style: {
                fontFamily: 'Arial',  // 强调状态下的字体
                fontSize: 12,  // 强调状态下的字体大小
                shadowBlur: 20,  // 阴影模糊度
                shadowOffsetX: 3,  // 阴影x偏移
                shadowOffsetY: 5,  // 阴影y偏移
                shadowColor: 'rgba(0,0,0,0.3)'  // 阴影颜色
            }
        }
    };
}

let cachedResults = {};

export function set_option_scatterDiagram2_base(_this, form, renderItem) {
    return {
        dataset: {
            source: form.dataList // 设置数据源
        },
        tooltip: {
            trigger: 'item', // 触发类型为数据项
            formatter: function (params) {
                // 检查 params 是否为数组，并且至少有一个元素
                let cacheKey = params.data[params.dimensionNames[0]] + '-' + params.name; // 生成缓存键
                if (cachedResults[cacheKey]) { // 如果缓存中有结果，返回缓存结果
                    return cachedResults[cacheKey]
                }
                console.log(params)
                // 生成结果字符串，包括带颜色的小点和数据项
                let result = colorDot(scatterDiagram_color_list[params.dataIndex % scatterDiagram_color_list.length])
                        + params.data[params.dimensionNames[0]].slice(form.option.length + 1)
                        + ": " + params.data[params.dimensionNames[1]];
                cachedResults[cacheKey] = result // 将结果缓存
                return result;
            },
            axisPointer: {
                type: 'cross', // 设置坐标指示器类型为十字准星
                lineStyle: {
                    type: 'dashed' // 设置线条样式为虚线
                }
            }
        },
        hoverLayerThreshold: Infinity, // 设置悬停层阈值
        series: [{
            type: 'custom', // 设置系列类型为自定义
            colorBy: 'data', // 根据数据项设置颜色
            renderItem: renderItem, // 渲染函数
            progressive: 0, // 进度
            coordinateSystem: 'none', // 不使用坐标系
            encode: {
                tooltip: form.value, // 提示框内容对应数据项的值
                itemName: form.id // 数据项名称对应数据项的id
            }
        }]
    }
}



/**
 * 数据集 基础配置（去除X轴线 去除圆角 和标题）
 * @param _this
 * @title 图表标题
 * @title_center 标题位置
 * @dimensions 维度 (数据集的分类)
 * @dataList 所有数据
 * @param form
 */
export function set_option_dataMart_base(_this, form) {
    let cachedResults = {};
    let color_list = ['#5571c8', '#92ce75', '#fac858']
    return {
        grid: {
            top: '15%',    // 调整顶部边距
            bottom: '6%', // 调整底部边距
            left: '3%',   // 调整左侧边距
            right: '5%',  // 调整右侧边距
            containLabel: true
        },
        legend: {
            top: '5%', // 设置图例距离顶部的百分比距离
            textStyle: {
                fontSize: 12,
                fontWeight: 'bold',
                color: form.title_color // 设置 tab_title 的颜色
            },
            itemHeight: 10, // 设置图例项的高度
            itemGap: 12, // 设置图例项之间的间隔
            icon: 'path://M0,4a4,4 0 0 1 4,-4h12a4,4 0 0 1 4,4v0a4,4 0 0 1 -4,4h-12a4,4 0 0 1 -4,-4z', // 设置图例项为圆角矩形
        },
        tooltip: {
            trigger: 'item',
            formatter: function (params) {
                // 检查 params 是否为数组，并且至少有一个元素
                let cacheKey = params.data[params.dimensionNames[0]] + '-' + params.seriesName;
                if (cachedResults[cacheKey]) {
                    return cachedResults[cacheKey]
                }
                let result = params.data[params.dimensionNames[0]] + '<br/>';
                result += colorDot(color_list[params.componentIndex]) + params.dimensionNames[params.componentIndex + 1] + ": " + params.data[params.seriesName];
                cachedResults[cacheKey] = result
                return result;
            },
            axisPointer: {
                type: 'cross',
                lineStyle: {
                    type: 'dashed' // 设置虚线样式
                }
            }
        },

        dataset: {
            dimensions: form.dimensions,
            source: form.dataList
        },
        xAxis: {
            type: 'category',
            axisLabel: {
                textStyle: {
                    color: form.x_color // X 轴标签文字颜色
                }
            },
            nameTextStyle: {
                fontWeight: 'bold',
                color: form.x_color // X 轴名称文字颜色
            },
            axisLine: {
                show: true, // 显示 X 轴线
                lineStyle: {
                    color: form.x_line_color // X 轴线颜色
                }
            },
            splitLine: {
                show: false // 隐藏 X 轴网格线
            },
            axisTick: {
                alignWithLabel: true
            },
            show: true
        },
        yAxis: {
            axisLabel: {
                textStyle: {
                    color: form.y_color // Y 轴标签文字颜色为白色
                }
            },
            nameTextStyle: {
                fontWeight: 'bold',
                color: form.y_color // Y 轴名称文字颜色为白色
            },
            axisLine: {
                show: true, // 显示 Y 轴线
                lineStyle: {
                    color: form.y_line_color // Y 轴线颜色
                }
            },
            splitLine: {
                show: false // 隐藏 Y 轴网格线
            },
            show: true // 显示 Y 轴
        },
        series: [
            {
                type: 'bar',
                barWidth: '10%', // 设置柱状图的宽度窄一点
            },
            {
                type: 'bar',
                barWidth: '10%', // 设置柱状图的宽度窄一点
            },
            {
                type: 'bar',
                barWidth: '10%', // 设置柱状图的宽度窄一点
            }
        ]
    };
}




/**
 * 数据集 配置
 * @param _this
 * @title 图表标题
 * @title_center 标题位置
 * @dimensions 维度 (数据集的分类)
 * @dataList 所有数据
 * @param form
 */
export function set_option_dataMart(_this, form) {
    let cachedResults = {};
    let color_list = ['#5571c8', '#92ce75', '#fac858']
    return {
        title: {
            text: form.title, // 设置图表标题
            left: '40px' // 标题位置
        },
        legend: {},
        tooltip: {
            trigger: 'item',
            formatter: function (params) {
                // 检查 params 是否为数组，并且至少有一个元素
                let cacheKey = params.data[params.dimensionNames[0]] + '-' + params.seriesName;
                if (cachedResults[cacheKey]) {
                    return cachedResults[cacheKey]
                }
                let result = params.data[params.dimensionNames[0]] + '<br/>';
                result += colorDot(color_list[params.componentIndex]) + params.dimensionNames[params.componentIndex + 1] + ": " + params.data[params.seriesName];
                cachedResults[cacheKey] = result
                return result;
            },
            axisPointer: {
                type: 'cross',
                lineStyle: {
                    type: 'dashed' // 设置虚线样式
                }
            }
        },

        dataset: {
            dimensions: form.dimensions,
            source: form.dataList
        },
        xAxis: {
            type: 'category'
        },
        yAxis: {},
        series: [
            {
                type: 'bar',
                itemStyle: {
                    borderRadius: [10, 10, 0, 0] // 圆角设置，四个角的圆角大小分别为：[左上, 右上, 右下, 左下]
                },
                label: {
                    show: true,
                    position: 'top',
                    formatter: function (params) {
                        return params.value[params.dimensionNames[params.dimensionNames.length - 3]]; // 显示每个柱状图的数值
                    }
                }
            },
            {
                type: 'bar',
                itemStyle: {
                    borderRadius: [10, 10, 0, 0] // 圆角设置
                },
                label: {
                    show: true,
                    position: 'top',
                    formatter: function (params) {
                        return params.value[params.dimensionNames[params.dimensionNames.length - 2]]; // 显示每个柱状图的数值
                    }
                }
            },
            {
                type: 'bar',
                itemStyle: {
                    borderRadius: [10, 10, 0, 0] // 圆角设置
                },
                label: {
                    show: true,
                    position: 'top',
                    formatter: function (params) {
                        return params.value[params.dimensionNames[params.dimensionNames.length - 1]]; // 显示每个柱状图的数值
                    }
                }
            }
        ]
    };
}


/**
 * 地图 基本版
 * @param _this
 * @title: '地图测试',  // 图表标题
 * @title_center: 'center', // 标题位置
 * @map_name:'songJiang', // 地图映射名称
 * @min: 800,
 * @max: 50000,
 * @addr:'所在小区',
 * @device_type:'设备类型',
 * @alarm_type:'告警类型',
 * @alarm_time:'告警时间',
 * @dataList: [] // 所有数据
 * @param form
 */
export async function set_option_areaMap_base(_this, form) {
    // 生成 tooltip formatter
    const formatter = createTooltipFormatterByAreaMap(form);
    return {
        title: {
            text: form.title,
            left: form.title_center // 标题位置
        },
        tooltip: {
            trigger: 'item',
            formatter: formatter
        },
        visualMap: {
            min: form.min,
            max: form.max,
            show: false,  // 不显示 visualMap
            inRange: {
                color: ['lightskyblue', 'yellow', 'orangered']
            }
        },
        series: [
            {
                type: 'map',
                map: form.map_name,
                label: {
                    show: true
                },
                data: form.dataList,
            }
        ]
    }
}

/**
 * 生成 tooltip
 * @param form
 * @returns {function(*): *}
 */
function createTooltipFormatterByAreaMap(form) {
    let cache = {}; // 缓存计算结果
    return function (params) {
        let dataIndex = params.dataIndex;
        if (!cache[dataIndex]) {
            console.log(params)
            let data = params.data;
            cache[dataIndex] = `${colorDot(colors[0])}${form.addr}: ${data.addr}<br>
                                ${colorDot(colors[1])}${form.device_type}: ${data.device_type}<br>
                                ${colorDot(colors[2])} ${form.alarm_type}: ${data.alarm_type}<br>
                                ${colorDot(colors[3])} ${form.alarm_time}: ${data.alarm_time}`;
        }
        return cache[dataIndex];
    }
}


function createTooltipFormatterByAreaMap2(form) {
    let cache = {}; // 缓存计算结果
    return function (params) {
        let dataIndex = params.dataIndex;
        if (!cache[dataIndex]) {
            console.log(params)
            cache[dataIndex] = `${colorDot(colors[4])}${form.street_name}: ${params.name}<br>
                                ${colorDot(colors[1])}${form.common_num}: ${params.value ? params.value : ""}
                                ${form.common_text ? '<br>' + colorDot(colors[5]) + form.common_text + ': ' + params.value : ''}`
        }
        return cache[dataIndex];
    }
}


/**
 * 地图 基本版 + 动图告警图标
 * @param _this
 * @title: '地图测试',  // 图表标题
 * @title_center: 'center', // 标题位置
 * @map_name:'songJiang', // 地图映射名称
 * @min: 800,
 * @max: 50000,
 * @addr:'所在小区',
 * @device_type:'设备类型',
 * @alarm_type:'告警类型',
 * @alarm_time:'告警时间',
 * @dataList: [] // 所有数据
 * @param form
 */
export async function set_option_areaMap_pro(_this, form) {
    // 构建散点图数据
    const scatterData = form.alarms.map((alarm, index) => ({
        name: alarm.name,
        value: [...alarm.coord, colorDot(colors[index]) + alarm.name + "<br/>" + colorDot(colors[index + 1]) + alarm.content]  // 经纬度 + 告警内容
    }));

    // 生成 tooltip formatter
    const formatter = createTooltipFormatterByAreaMap(form);
    return {
        title: {
            text: form.title,
            left: form.title_center // 标题位置
        },
        tooltip: {
            trigger: 'item',
            formatter: function (params) {
                if (params.seriesType === 'scatter') {
                    return params.data.value[2];  // 显示告警信息内容
                } else {
                    return formatter(params);
                }
            }
        },
        visualMap: {
            min: form.min,
            max: form.max,
            show: false,  // 不显示 visualMap
            inRange: {
                color: ['lightskyblue', 'yellow', 'orangered']
            }
        },
        geo: {
            map: form.map_name,
            roam: true,  // 允许缩放和平移
            label: {
                show: true,
                emphasis: {
                    show: true,
                    color: '#fff'  // 高亮时的文字颜色
                }
            },
            itemStyle: {
                normal: {
                    areaColor: '#323c48',
                    borderColor: '#111'
                },
                emphasis: {
                    areaColor: '#ff9900',  // 高亮时的区域颜色
                    borderColor: '#fff',
                    borderWidth: 1
                }
            }
        },
        series: [
            {
                type: 'map',
                map: form.map_name,
                geoIndex: 0,  // 关联geo坐标系
                label: {
                    show: true
                },
                itemStyle: {
                    emphasis: {
                        areaColor: '#ffb33f',  // 高亮时的区域颜色
                        borderColor: '#fff',
                        borderWidth: 1
                    }
                },
                data: form.dataList,
            },
            {
                type: 'scatter',  // 添加散点图层显示告警图标
                coordinateSystem: 'geo',
                geoIndex: 0,
                symbol: 'image://' + form.imgUrl,  // 告警图标
                symbolSize: 30,  // 图标大小
                data: scatterData,
                tooltip: {
                    formatter: function (params) {
                        return params.data.value[2];  // 显示告警信息内容
                    }
                },
                zlevel: 1  // 设置图层级别，确保图标在地图上方
            }
        ]
    };
}








/**
 * 地图 基本版 + 告警图标 + 渐变地图
 * @param _this
 * @title: '地图测试',  // 图表标题
 * @title_center: 'center', // 标题位置
 * @map_name:'songJiang', // 地图映射名称
 * @min: 800,
 * @max: 50000,
 * @addr:'所在小区',
 * @device_type:'设备类型',
 * @alarm_type:'告警类型',
 * @alarm_time:'告警时间',
 * @dataList: [] // 所有数据
 * @param form
 */
/*export async function set_option_areaMap_plus(_this, form) {
    // 构建散点图数据
    const scatterData = form.alarms.map((alarm, index) => ({
        name: alarm.name,
        value: [...alarm.coord, colorDot(colors[index]) + alarm.name + "<br/>" + colorDot(colors[index + 1]) + alarm.content]  // 经纬度 + 告警内容
    }));

    // 生成 tooltip formatter
    const formatter = createTooltipFormatterByAreaMap(form);

    return {
        tooltip: {
            trigger: 'item',
            formatter: function (params) {
                if (params.seriesType === 'scatter') {
                    return params.data.value[2];  // 显示告警信息内容
                } else {
                    return formatter(params);
                }
            }
        },
        visualMap: {
            min: form.min,
            max: form.max,
            show: false,  // 不显示 visualMap
            inRange: {
                color: ['rgba(0, 78, 135, 0.6)', 'rgba(0, 105, 154, 0.6)']  // 渐变色，带0.6透明度
            }
        },
        geo: {
            map: form.map_name,
            roam: true,  // 允许缩放和平移
            layoutCenter: ['52%', '45%'],  // 地图居中
            layoutSize: '88%',  // 放大地图以补偿偏移效果
            itemStyle: {
                normal: {
                    areaColor: {
                        type: 'linear',
                        x: 0,
                        y: 1,  // 设置从底部向上的渐变
                        x2: 1,
                        y2: 0,
                        colorStops: [
                            {offset: 0, color: 'rgba(0, 78, 135, 0.85)'},  // 底部较深的颜色
                            {offset: 1, color: 'rgba(0, 105, 154, 0.85)'}   // 顶部较浅的颜色
                        ],
                        global: false
                    },
                    borderColor: 'rgba(173, 255, 255, 1)',  // 边界颜色，亮度增加
                    borderWidth: 1  // 边界宽度增加1px
                },
                emphasis: {
                    areaColor: 'rgba(0, 78, 135, 1)',  // 高亮时的区域颜色
                    borderColor: 'rgba(255, 255, 255, 1)',  // 高亮时的边界颜色更亮
                    borderWidth: 2,  // 高亮时的边界宽度增加
                    shadowColor: 'rgba(0, 0, 0, 0.7)',  // 高亮时的阴影颜色更深
                    shadowBlur: 20,  // 增加高亮时的阴影模糊效果
                    shadowOffsetX: -12,  // 高亮时的阴影X轴偏移
                    shadowOffsetY: 12  // 高亮时的阴影Y轴偏移
                }
            },
            label: {
                show: true,
                formatter: function (params) {
                    let value = null;
                    let filter = form.dataList.find(item => item.name === params.name);
                    if (filter) value = filter.value;

                    // 使用 rich text 进行样式设置
                    return [
                        `{value|${value}}`,
                        `{name|${params.name}}`
                    ].join(' \n ');
                },
                rich: {
                    value: {
                        color: '#ff5722',  // 数值的颜色
                        fontSize: 16,      // 数值的字体大小
                        fontWeight: 'bold', // 数值的字体粗细
                        lineHeight: 25    // 数值的行高，增加上下间距
                    },
                    name: {
                        color: '#ffffff',  // 名称的颜色
                        fontSize: 14      // 名称的字体大小
                    }
                },
                emphasis: {
                    show: true,
                    formatter: function (params) {
                        let value = null;
                        let filter = form.dataList.find(item => item.name === params.name);
                        if (filter) value = filter.value;

                        // 高亮时的样式
                        return [
                            `{value|${value}}`,
                            `{name|${params.name}}`
                        ].join('\n');
                    },
                    rich: {
                        value: {
                            color: '#ff5722',  // 高亮时数值的颜色
                            fontSize: 20,      // 高亮时数值的字体大小
                            fontWeight: 'bold', // 高亮时数值的字体粗细
                            lineHeight: 30    // 高亮时数值的行高，增加上下间距
                        },
                        name: {
                            color: '#ffffff',  // 高亮时名称的颜色
                            fontSize: 18     // 高亮时名称的字体大小
                        }
                    }
                }
            }
        },
        series: [
            {
                type: 'map',
                map: form.map_name,
                geoIndex: 0,  // 关联geo坐标系
                itemStyle: {
                    normal: {
                        areaColor: {
                            type: 'linear',
                            x: 0,
                            y: 1,  // 设置从底部向上的渐变
                            x2: 1,
                            y2: 0,
                            colorStops: [
                                {offset: 0, color: 'rgba(0, 78, 135, 0.8)'},  // 底部较深的颜色
                                {offset: 1, color: 'rgba(0, 105, 154, 0.6)'}   // 顶部较浅的颜色
                            ],
                            global: false
                        },
                        borderColor: 'rgba(173, 255, 255, 1)',  // 边界颜色，亮度增加
                        borderWidth: 1  // 边界宽度增加1px
                    },
                    emphasis: {
                        areaColor: 'rgba(0, 78, 135, 1)',  // 高亮时的区域颜色
                        borderColor: 'rgba(255, 255, 255, 1)',  // 高亮时的边界颜色更亮
                        borderWidth: 2,  // 高亮时的边界宽度增加
                        shadowColor: 'rgba(0, 0, 0, 0.7)',  // 高亮时的阴影颜色更深
                        shadowBlur: 20,  // 增加高亮时的阴影模糊效果
                        shadowOffsetX: -12,  // 高亮时的阴影X轴偏移
                        shadowOffsetY: 12  // 高亮时的阴影Y轴偏移
                    }
                },
                label: {
                    show: true,
                    color: '#fff',  // 标签颜色为白色
                    formatter: function (params) {
                        // 显示名称和数值
                        return `${params.name}: ${params.value}`;
                    }
                },
                data: form.dataList,
            },
            {
                type: 'scatter',  // 添加散点图层显示告警图标
                coordinateSystem: 'geo',
                geoIndex: 0,
                symbol: 'image://' + form.imgUrl,  // 告警图标
                symbolSize: 28,  // 图标大小
                data: scatterData,
                tooltip: {
                    formatter: function (params) {
                        return params.data.value[2];  // 显示告警信息内容
                    }
                },
                zlevel: 100  // 设置图层级别，确保图标在地图上方
            }
        ],
        graphic: [
            {
                type: 'rect',
                left: 'center',
                top: 'center',
                z: -10,  // 设置在地图下层
                shape: {
                    width: '100%',
                    height: '100%'
                },
                style: {
                    fill: 'transparent',  // 透明填充
                    shadowColor: 'rgba(0, 0, 0, 0.5)',  // 整体阴影颜色
                    shadowBlur: 50,  // 整体阴影模糊程度
                    shadowOffsetX: -20,  // 阴影X轴偏移
                    shadowOffsetY: 20  // 阴影Y轴偏移
                }
            }
        ]
    };
}*/


export async function set_option_areaMap_plus(_this, form) {
    let scatterData = [];

    // 构建散点图数据
    if (form.alarms && form.alarms.length > 0) {
        scatterData = form.alarms.map((alarm) => ({
            name: alarm.name,
            value: [...alarm.coord,
                `${colorDot(colors[0])}${form.community}: ${alarm.community}<br>
                 ${colorDot(colors[1])}${form.deviceType}: ${alarm.deviceTypeName}<br>
                 ${colorDot(colors[2])}${form.alarmType}: ${alarm.alarmTypeName}<br>
                 ${colorDot(colors[3])}${form.alarmTime}: ${alarm.alarmTime}`] // 经纬度 + 告警内容
        }));
    }

    // 生成 tooltip formatter
    const formatter = createTooltipFormatterByAreaMap2(form);

    return {
        tooltip: {
            trigger: 'item',
            formatter: function (params) {
                if (params.seriesType === 'scatter') {
                    return params.data.value[2];  // 显示告警信息内容
                } else {
                    return formatter(params);
                }
            }
        },
        visualMap: {
            min: form.min,
            max: form.max,
            show: false,  // 不显示 visualMap
            inRange: {
                color: ['rgba(0, 105, 154, 0.75)', 'rgba(0, 78, 135, 0.9)']  // 渐变色
            }
        },
        geo: {
            map: form.map_name,
            roam: true,  // 允许缩放和平移
            layoutCenter: ['52%', '45%'],  // 地图居中
            layoutSize: '88%',  // 放大地图
            itemStyle: {
                normal: {
                    areaColor: {
                        type: 'linear',
                        x: 0,
                        y: 1,  // 设置从底部向上的渐变
                        x2: 1,
                        y2: 0,
                        colorStops: [
                            { offset: 0, color: 'rgba(0, 78, 135, 0.85)' },  // 底部较深的颜色
                            { offset: 1, color: 'rgba(0, 105, 154, 0.85)' }   // 顶部较浅的颜色
                        ],
                        global: false
                    },
                    borderColor: 'rgba(173, 255, 255, 1)',  // 边界颜色
                    borderWidth: 1  // 边界宽度增加1px
                },
                emphasis: {
                    areaColor: 'rgba(0, 78, 135, 1)',  // 高亮时的区域颜色
                    borderColor: 'rgba(255, 255, 255, 1)',  // 高亮时的边界颜色
                    borderWidth: 2,  // 高亮时的边界宽度增加
                    shadowColor: 'rgba(0, 0, 0, 0.7)',  // 高亮时的阴影颜色
                    shadowBlur: 20,  // 增加高亮时的阴影模糊效果
                    shadowOffsetX: -12,  // 高亮时的阴影X轴偏移
                    shadowOffsetY: 12  // 高亮时的阴影Y轴偏移
                }
            },
            label: {
                show: true,
                formatter: function (params) {
                    let value = null;
                    let filter = form.dataList.find(item => item.name === params.name);
                    if (filter) value = filter.value;

                    return [
                        `{value|${value ? value : ''}}`,
                        `{name|${params.name}}`
                    ].join(' \n ');
                },
                rich: {
                    value: {
                        color: '#ff5722',
                        fontSize: 16,
                        fontWeight: 'bold',
                        lineHeight: 25
                    },
                    name: {
                        color: '#ffffff',
                        fontSize: 14
                    }
                },
                emphasis: {
                    show: true,
                    formatter: function (params) {
                        let value = null;
                        let filter = form.dataList.find(item => item.name === params.name);
                        if (filter) value = filter.value;
                        return [
                            `{value|${value ? value : ''}}`,
                            `{name|${params.name}}`
                        ].join('\n');
                    },
                    rich: {
                        value: {
                            color: '#ff5722',
                            fontSize: 20,
                            fontWeight: 'bold',
                            lineHeight: 30
                        },
                        name: {
                            color: '#ffffff',
                            fontSize: 18
                        }
                    }
                }
            }
        },
        series: [
            {
                type: 'map',
                map: form.map_name,
                geoIndex: 0,
                itemStyle: {
                    normal: {
                        areaColor: {
                            type: 'linear',
                            x: 0,
                            y: 1,
                            x2: 1,
                            y2: 0,
                            colorStops: [
                                { offset: 0, color: 'rgba(0, 78, 135, 0.8)' },
                                { offset: 1, color: 'rgba(0, 105, 154, 0.6)' }
                            ],
                            global: false
                        },
                        borderColor: 'rgba(173, 255, 255, 1)',
                        borderWidth: 1
                    },
                    emphasis: {
                        areaColor: 'rgba(0, 78, 135, 1)',
                        borderColor: 'rgba(255, 255, 255, 1)',
                        borderWidth: 2,
                        shadowColor: 'rgba(0, 0, 0, 0.7)',
                        shadowBlur: 20,
                        shadowOffsetX: -12,
                        shadowOffsetY: 12
                    }
                },
                label: {
                    show: true,
                    color: '#fff',
                    formatter: function (params) {
                        return `${params.name}: ${params.value}`;
                    }
                },
                data: form.dataList,
            },
            {
                type: 'scatter',
                coordinateSystem: 'geo',
                geoIndex: 0,
                symbol: 'image://' + form.imgUrl,
                symbolSize: 28,
                data: scatterData,
                tooltip: {
                    formatter: function (params) {
                        return params.data.value[2];
                    }
                },
                zlevel: 100
            }
        ],
        graphic: [
            {
                type: 'rect',
                left: 'center',
                top: 'center',
                z: -10,
                shape: {
                    width: '100%',
                    height: '100%'
                },
                style: {
                    fill: 'transparent',
                    shadowColor: 'rgba(0, 0, 0, 0.5)',
                    shadowBlur: 50,
                    shadowOffsetX: -20,
                    shadowOffsetY: 20
                }
            }
        ]
    };
}










/**
 * 进度条
 */

/**
 * 进度条 有标题 和 背景颜色
 * @param _this
 * @param form
 */
export function set_option_progress_bar(_this, form) {
    return {
        backgroundColor: form.backgroundColor,
        title: [
            {
                text: form.left_title,  // 左端标题
                left: '10%',  // 调整到合适的位置
                top: '10',  // 调整到进度条上方
                textStyle: {
                    color: '#fff',
                    fontSize: 16
                }
            },
            {
                text: form.right_title,  // 右端标题
                right: '10%',  // 调整到合适的位置
                top: '10',  // 调整到进度条上方
                textStyle: {
                    color: '#fff',
                    fontSize: 16
                }
            }
        ],
        yAxis: {
            type: 'category',
            axisLine: {
                show: false, //坐标线
            },
            axisTick: {
                show: false, //小横线
            },
            axisLabel: {
                color: '#999', //坐标轴字颜色
            },
        },
        xAxis: {
            show: false,
            max: form.max,
        },
        grid: {
            top: '40',
            right: '10%',
            left: '10%',
            bottom: '40', //图表尺寸大小
        },
        animationDuration: 3000,
        series: [
            {
                type: 'bar',
                barWidth: '10px',
                showBackground: true,
                backgroundStyle: {
                    color: 'rgba(220, 220, 220, 0.4)',
                    // barBorderRadius: [30, 30, 30, 30] //圆角大小
                },
                label: {
                    show: true,
                    position: 'right', //每一条的数据位置
                    padding: [-22, 0, 0, -15],
                    formatter: (params) => {
                        return '▼' + form.over_scale + '%';
                    },
                    textStyle: {
                        color: '#fff',
                        fontSize: 20
                    },
                },
                itemStyle: {
                    normal: {
                        color: form.color, //每个数据的颜色
                        // barBorderRadius: [30, 30, 30, 30], //圆角大小
                        shadowBlur: 10,
                        shadowColor: 'rgba(0, 103, 255, 0.2)',
                        shadowOffsetX: -5,
                        shadowOffsetY: 5,
                    },
                },
                data: form.dataList,
            },
        ],
    };
}

/**
 * 进度条 没有标题 和 背景颜色
 * @param _this
 * @param form
*/
/*export function set_option_progress_bar_not_title(_this, form) {
    return {
        yAxis: {
            type: 'category',
            axisLine: {
                show: false, //坐标线
            },
            axisTick: {
                show: false, //小横线
            },
            axisLabel: {
                color: '#999', //坐标轴字颜色
            },
        },
        xAxis: {
            show: false,
            max: form.max,
        },
        grid: {
            top: '40',
            right: '10%',
            left: '10%',
            bottom: '40', //图表尺寸大小
        },
        animationDuration: 3000,
        series: [
            {
                type: 'bar',
                barWidth: '10px',
                showBackground: true,
                backgroundStyle: {
                    color: 'rgba(220, 220, 220, 0.4)',
                    // barBorderRadius: [30, 30, 30, 30] //圆角大小
                },
                label: {
                    show: true,
                    position: 'right', //每一条的数据位置
                    padding: [-22, 0, 0, -15],
                    formatter: (params) => {
                        return '▼' + form.over_scale + '%';
                    },
                    textStyle: {
                        color: '#fff',
                        fontSize: 20
                    },
                },
                itemStyle: {
                    normal: {
                        color: form.color, //每个数据的颜色
                        // barBorderRadius: [30, 30, 30, 30], //圆角大小
                        shadowBlur: 10,
                        shadowColor: 'rgba(0, 103, 255, 0.2)',
                        shadowOffsetX: -5,
                        shadowOffsetY: 5,
                    },
                },
                data: form.dataList,
            },
        ],
    };
}*/


export function set_option_progress_bar_not_title(_this, form) {
    return {
        yAxis: {
            type: 'category',
            axisLine: {
                show: false, // 隐藏坐标线
            },
            axisTick: {
                show: false, // 隐藏小横线
            },
            axisLabel: {
                color: '#999', // 坐标轴字颜色
            },
        },
        xAxis: {
            show: false,
            max: form.max,
        },
        grid: {
            top: '40',
            right: '10%',
            left: '10%',
            bottom: '40', // 图表尺寸大小
        },
        animationDuration: 3000,
        series: [
            {
                type: 'bar',
                barWidth: '10px',
                showBackground: true,
                backgroundStyle: {
                    color: form.noDataColor || 'rgba(220, 220, 220, 0.4)', // 没有数据的颜色
                    borderColor: form.borderColor, // 设置边框颜色
                    borderWidth: 1, // 设置边框宽度
                    // barBorderRadius: [30, 30, 30, 30] // 圆角大小
                },
                label: {
                    show: true,
                    position: 'right', // 每一条的数据位置
                    padding: [-22, 0, 0, -15],
                    formatter: (params) => {
                        return '▼' + form.over_scale + '%';
                    },
                    textStyle: {
                        color: '#fff',
                        fontSize: 20
                    },
                },
                itemStyle: {
                    normal: {
                        color: form.color, // 有数据的颜色
                        // barBorderRadius: [30, 30, 30, 30], // 圆角大小
                        shadowBlur: 10,
                        shadowColor: 'rgba(0, 103, 255, 0.2)',
                        shadowOffsetX: -5,
                        shadowOffsetY: 5,
                    },
                },
                data: form.dataList,
            },
        ],
    };
}






/**
 * 从本地json文件中读取地区坐标系数据
 * @param path
 * @returns {Promise<any|null>}
 */
export async function fetch_shangHai_area_coordinate(path) {
    try {
        const response = await axios.get(path);
        return response.data;
    } catch (error) {
        console.error('获取文件时出错：', error);
        return null;
    }
}


/**
 *  计算最大值
 * @param currentValue
 * @param defaultMax
 * @returns {number|number}
 */
export function calculateMaxValue(currentValue, defaultMax) {
    if (!defaultMax) defaultMax = 10 // 选择10作为基础
    // 确保 defaultMax 是 10 的倍数
    const base = defaultMax % 10
    if (base !== 0) {
        defaultMax += 10 - base // 增加一个能够使 defaultMax 成为10的倍数的数
    }
    // 计算新的 maxValue
    return currentValue < defaultMax ? defaultMax : Math.ceil(currentValue * 1.5)
}

export function filterOption(input, option) {
    return (
            option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
    )
}

export function readBlobAsText(blob) {
    return new Promise((resolve, reject) => {
        const reader = new FileReader()

        reader.onload = () => {
            const text = reader.result
            resolve(text)
        }

        reader.onerror = () => {
            reject(new Error('Failed to read Blob as text.'))
        }

        reader.readAsText(blob)
    })
}

/**
 * 确认弹窗
 * @param content '您确定要' + content + '?'
 * @returns {Promise<boolean>}
 */
export async function vxe_table_modal_confirm(content) {
    const type = await VXETable.modal.confirm('您确定要' + content + '?')
    return type === 'cancel' || type === 'close'
}

/**
 * 确认弹窗
 * @param content  自定义弹窗内容
 * @returns {Promise<boolean>}
 */
export async function vxe_table_modal_confirm2(content) {
    const type = await VXETable.modal.confirm(content)
    return type === 'cancel' || type === 'close'
}

export function success_msg(title, msg) {
    return new Promise((resolve) => {
        Modal.success({
            title: title,
            content: msg,
            onOk() {
                resolve(false)
            },
            onCancel() {
                resolve(true)
            }
        })
    })
}

/**
 * 使用 Number 类型和 toFixed 方法将值保留两位小数
 * @param number
 * @returns {number|string|*|string}
 */
export function formattedValue(number) {
    if (number) {
        return Number(number).toFixed(2)
    } else {
        return number
    }
}

/**
 * 获取浏览器信息
 * @returns {*[]}
 */
export function getBrowserInfo() {
    const agent = navigator.userAgent.toLowerCase()
    // console.log("agent:", agent);
    const arr = []
    const system = agent.split(' ')[1].split(' ')[0].split('(')[1]
    arr.push(system)
    const regStr_edge = /edge\/[\d.]+/gi
    const regStr_ie = /trident\/[\d.]+/gi
    const regStr_ff = /firefox\/[\d.]+/gi
    const regStr_chrome = /chrome\/[\d.]+/gi
    const regStr_saf = /safari\/[\d.]+/gi
    const regStr_opera = /opr\/[\d.]+/gi
    //IE
    if (agent.indexOf('trident') > 0) {
        arr.push(agent.match(regStr_ie)[0].split('/')[0])
        arr.push(agent.match(regStr_ie)[0].split('/')[1])
        return arr
    }
    //Edge
    if (agent.indexOf('edge') > 0) {
        arr.push(agent.match(regStr_edge)[0].split('/')[0])
        arr.push(agent.match(regStr_edge)[0].split('/')[1])
        return arr
    }
    //firefox
    if (agent.indexOf('firefox') > 0) {
        arr.push(agent.match(regStr_ff)[0].split('/')[0])
        arr.push(agent.match(regStr_ff)[0].split('/')[1])
        return arr
    }
    //Opera
    if (agent.indexOf('opr') > 0) {
        arr.push(agent.match(regStr_opera)[0].split('/')[0])
        arr.push(agent.match(regStr_opera)[0].split('/')[1])
        return arr
    }
    //Safari
    if (agent.indexOf('safari') > 0 && agent.indexOf('chrome') < 0) {
        arr.push(agent.match(regStr_saf)[0].split('/')[0])
        arr.push(agent.match(regStr_saf)[0].split('/')[1])
        return arr
    }
    //Chrome
    if (agent.indexOf('chrome') > 0) {
        arr.push(agent.match(regStr_chrome)[0].split('/')[0])
        arr.push(agent.match(regStr_chrome)[0].split('/')[1])
        return arr
    }
    // else{
    //   arr.push('请更换主流浏览器,例如chrome,firefox,opera,safari,IE,Edge!')
    //   return arr;
    // }
}

/**
 *  获取当前时间（YYYY-MM-DD HH:mm:ss）
 * @returns {string}
 */
export function getCurrentTime() {
    let date = new Date()
    let year = date.getFullYear()
    let month = (date.getMonth() + 1 < 10 ? '0' : '') + (date.getMonth() + 1)
    let day = (date.getDate() < 10 ? '0' : '') + date.getDate()
    let hours = (date.getHours() < 10 ? '0' : '') + date.getHours()
    let minutes = (date.getMinutes() < 10 ? '0' : '') + date.getMinutes()
    let seconds = (date.getSeconds() < 10 ? '0' : '') + date.getSeconds()
    return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
}

/**
 * 获取当前时间（YYYY-MM-DD 星期X HH:mm）/（YYYY-MM-DD 星期X HH:mm:ss）
 * @param exit_second 是否显示秒 true 显示 、 false 不显示
 */
export function getCurrentTime2(exit_second) {
    // 创建一个新的 Date 对象，表示当前日期和时间
    let date = new Date();
    // 定义一个数组，包含一周七天的中文名称
    const days = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
    // 获取当前年份
    const year = date.getFullYear();
    // 获取当前月份（0-11），并将其转换为字符串格式，若月份小于10，则在前面补零
    const month = (date.getMonth() + 1).toString().padStart(2, '0');
    // 获取当前日期，并将其转换为字符串格式，若日期小于10，则在前面补零
    const day = date.getDate().toString().padStart(2, '0');
    // 获取当前星期几，并从 days 数组中获取对应的中文名称
    const weekday = days[date.getDay()];
    // 获取当前小时数，并将其转换为字符串格式，若小时数小于10，则在前面补零
    const hours = date.getHours().toString().padStart(2, '0');
    // 获取当前分钟数，并将其转换为字符串格式，若分钟数小于10，则在前面补零
    const minutes = date.getMinutes().toString().padStart(2, '0');
    const seconds = date.getSeconds().toString().padStart(2, '0');

    // 将以上获取的年、月、日、星期几、小时和分钟拼接成所需的格式，并返回这个字符串
    if (exit_second) {
        return `${year}-${month}-${day} ${weekday} ${hours}:${minutes}:${seconds}`;
    } else {
        return `${year}-${month}-${day} ${weekday} ${hours}:${minutes}`;
    }
}


/**
 *  获取差值时间（距离2024-05-19 17:00:00已有）
 * @param time 开始时间
 * @returns {string}
 */
export function getDifferenceTime(time) {
    let currentDate = new Date()
    let fixedDate = new Date(time) // 固定时间

    // 计算差值（单位：毫秒）
    let difference = currentDate - fixedDate

    // 将毫秒转换为天数
    let days = Math.floor(difference / (1000 * 60 * 60 * 24))

    // 如果天数足够大，则转换为年
    let years = Math.floor(days / 365)
    let remainingDays = days % 365

    // 将毫秒转换为小时、分钟和秒
    let seconds = Math.floor((difference / 1000) % 60)
    let minutes = Math.floor((difference / (1000 * 60)) % 60)
    let hours = Math.floor((difference / (1000 * 60 * 60)) % 24)

    // 格式化输出
    let uptime = ''
    if (years > 0) {
        uptime += `${years} 年 `
    }
    if (remainingDays > 0 || years > 0) {
        uptime += `${remainingDays} 天 `
    }
    uptime += `${hours} 时 ${minutes} 分 ${seconds} 秒`
    return uptime
}

/**
 *  获取差值时间（距离2024-05-19 17:00:00已有）
 * @param time 开始时间
 * @returns {arr}
 */
export function getDifferenceTime2(time) {
    let arr = []
    let currentDate = new Date()
    let fixedDate = new Date(time) // 固定时间

    // 计算差值（单位：毫秒）
    let difference = currentDate - fixedDate

    // 将毫秒转换为天数
    let days = Math.floor(difference / (1000 * 60 * 60 * 24))

    // 如果天数足够大，则转换为年
    let years = Math.floor(days / 365)
    let remainingDays = days % 365

    // 将毫秒转换为小时、分钟和秒
    let seconds = Math.floor((difference / 1000) % 60)
    let minutes = Math.floor((difference / (1000 * 60)) % 60)
    let hours = Math.floor((difference / (1000 * 60 * 60)) % 24)

    // 格式化输出
    if (years > 0) {
        arr.push(years)
    }
    arr.push(remainingDays)
    arr.push(hours)
    arr.push(minutes)
    arr.push(seconds)
    return arr
}

export function getDifferenceTime3(time) {
    let arr = []
    let currentDate = new Date()
    let fixedDate = new Date(time) // 固定时间

    // 计算差值（单位：毫秒）
    let difference = currentDate - fixedDate

    // 将毫秒转换为天数
    let days = Math.floor(difference / (1000 * 60 * 60 * 24))

    arr.push(days)
    return arr
}


/**
 * 获取指定月份的所以天数 数组
 * @param year
 * @param month
 * @returns {*[]}
 */
export function getDaysArray(year, month) {
    const now = new Date();
    year = year || now.getFullYear()
    month = month || now.getMonth() + 1
    const date = new Date(year, month - 1, 1);
    const days = [];
    while (date.getMonth() === month - 1) {
        const day = date.getDate().toString().padStart(2, '0');
        days.push(`${month.toString().padStart(2, '0')}-${day}`);
        date.setDate(date.getDate() + 1);
    }
    return days;
}


/**
 * 获取本周日期
 * @returns {*[]}
 */
export function getWeekDates() {
    const today = new Date();
    const first = today.getDate() - today.getDay() + 1; // 获取本周第一天（周一）
    const firstDayOfWeek = new Date(today.setDate(first));
    const dates = [];

    for (let i = 0; i < 7; i++) {
        const nextDay = new Date(firstDayOfWeek);
        nextDay.setDate(firstDayOfWeek.getDate() + i);
        dates.push(`${nextDay.getFullYear()}-${(nextDay.getMonth() + 1).toString().padStart(2, '0')}-${nextDay.getDate().toString().padStart(2, '0')}`);
    }

    return dates;
}



/**
 * 包含本周、本月和本年开始时间和结束时间。
 * @returns {{week: {start: Date, end: Date}, month: {start: Date, end: Date}, year: {start: Date, end: Date}}}
 */
export function get_time_week_month_year(format = 'yyyy-MM-dd HH:mm:ss') {
    const now = new Date();

    // 获取本周的开始和结束时间
    const startOfWeek = new Date(now);
    const dayOfWeek = now.getDay() || 7;
    startOfWeek.setDate(now.getDate() - dayOfWeek + 1);
    startOfWeek.setHours(0, 0, 0, 0);

    const endOfWeek = new Date(startOfWeek);
    endOfWeek.setDate(startOfWeek.getDate() + 6);
    endOfWeek.setHours(23, 59, 59, 999);

    // 获取本月的开始和结束时间
    const startOfMonth = new Date(now.getFullYear(), now.getMonth(), 1);
    const endOfMonth = new Date(now.getFullYear(), now.getMonth() + 1, 0);
    endOfMonth.setHours(23, 59, 59, 999);

    // 获取本年的开始和结束时间
    const startOfYear = new Date(now.getFullYear(), 0, 1);
    const endOfYear = new Date(now.getFullYear(), 11, 31);
    endOfYear.setHours(23, 59, 59, 999);

    return {
        week: {
            start: get_time_formatDate(startOfWeek, format),
            end: get_time_formatDate(endOfWeek, format),
        },
        month: {
            start: get_time_formatDate(startOfMonth, format),
            end: get_time_formatDate(endOfMonth, format),
        },
        year: {
            start: get_time_formatDate(startOfYear, format),
            end: get_time_formatDate(endOfYear, format),
        },
    };
}

/**
 *  格式化日期
 * @param date
 * @param format
 * @returns {string}
 */
function get_time_formatDate(date, format = 'yyyy-MM-dd HH:mm:ss') {
    const pad = (n) => (n < 10 ? '0' + n : n);
    const map = {
        yyyy: date.getFullYear(),
        MM: pad(date.getMonth() + 1),
        dd: pad(date.getDate()),
        HH: pad(date.getHours()),
        mm: pad(date.getMinutes()),
        ss: pad(date.getSeconds()),
    };

    return format.replace(/yyyy|MM|dd|HH|mm|ss/g, (matched) => map[matched]);
}





/**
 * 返回给定日期是星期几
 * @param {string} dateStr - 日期字符串，格式默认为'YYYY-MM-DD'
 * @param {string} format - 输入日期字符串的格式，默认为'YYYY-MM-DD'
 * @returns {string} 返回星期几
 */
export function get_day_of_week_by_format(dateStr, format = 'YYYY-MM-DD') {
    const dayNames = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
    let date = moment(dateStr, format); // 使用moment解析日期
    return dayNames[date.day()]; // 返回星期几
}

